<!-- Data Tables -->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        {volist name="goods" id="v"}
        <div class="col-sm-6">
            <div class="contact-box">
                <div class="img col-sm-5">
                    <img class="image" alt="image" src="/{$v.img_src}">
                </div>
                <div class="col-sm-7 text">
                    <h3><strong>{$v.name}</strong></h3>
                    <p>{:lang('Price')}:{$v.price} {:lang('RMB')}</p>
                    <p>{$v.remark}</p>
                    <a href="/admin/mall/pay?id={$v.id}"><button id ='button' type="submit" class="btn btn-primary block full-width">{:lang('Buy')}</button></a>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
        {/volist}
        
        
    </div>
</div>
<div id="outerdiv" style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:9999;width:100%;height:100%;display:none;">
    <div id="innerdiv" style="position:absolute;width:100%;height:100%">
        <img id="bigimg" style="border:5px solid #fff;" src="" />
    </div>
</div>
<style type="text/css">
    .contact-box{
        padding: 0;
    }
    .img{
        padding: 0;
    }
    .img img{
        width: 100%;
    }
    .text{
        padding: 10px;
    }
    #bigimg{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        max-width: 80%;
        max-height: 80%;
    }
</style>
<script type="text/javascript">

    function operateFormatter(value, row, index) {
        return [
            '<a class="btn btn-xs edit" href="javascript:void(0)" title="{$Think.lang.Edit}">',
            '<i class="fa fa-edit"></i>',
            '</a>  ',
            '<a class="btn btn-xs delete" href="javascript:void(0)" title="{$Think.lang.Delete}">',
            '<i class="fa fa-trash"></i>',
            '</a>'
        ].join('');
    }

    var operateEvents = {
        'click .edit': function (e, value, row, index) {
            var param = {
                url: "{:url('admin/user/edit');}",
                data: {id: row.id}
            }
            $("#table").gridView('loadModal', param.url,param.data)
        },
        'click .delete': function (e, value, row, index) {
            $("#table").gridView('deleteModal', 'delete', row)
            
        }
    };
</script>
<script type="text/javascript">
    function copyText() {
      var eth = document.getElementById("eth");
      eth.select(); 
      document.execCommand("Copy"); 
      alert("{:lang('Duplicate success')}");
    }
    $('.image').click(function(){
        var _this = $(this);                            
        imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);

    });
    function imgShow(outerdiv, innerdiv, bigimg, _this) {
        var src = _this.attr("src");                    
        $(bigimg).attr("src", src);                     
        $(outerdiv).fadeIn("fast");                 
        $('#outerdiv').click(function () {              
            $(this).fadeOut("fast");
        });
    }
</script>  
<script type="text/javascript">

    $('.full-width').click(function(){
        //alert("{:lang('Not open for the time being')},{:lang('Please wait for the end of the private placement')}");

    });




</script>